<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
    <meta name="x5-fullscreen" content="true">
    <meta name="full-screen" content="yes">
    <title>排行榜</title>
    <link rel="stylesheet" type="text/css" media="screen" href="{$staticHost}/static/css/base.css?v=15" />
    <link rel="stylesheet" type="text/css" media="screen" href="{$staticHost}/static/css/mod.css?v=15" />
    <link rel="stylesheet" type="text/css" media="screen" href="{$staticHost}/static/css/run.css?v=1212" />
    <script src="{$staticHost}/static/js/iscroll.js"></script>
    <script src="{$staticHost}/static/js/mod.js"></script>
    <script src="{$staticHost}/static/js/js.js"></script>
    <script src="{$staticHost}/static/js/jquery.min.js"></script>
    </head>
    <style type="text/css">

    </style>
<body onload="loaded()" class="pb50">
  {if $isTop==0}
  <section id="tipss" class="share-tips">
    想要得人气冠军？快快分享到朋友圈召集好友点赞吧！<br/>
    还可抽奖得到整套跑步装备哦！
    <img id="share-close" src="{$staticHost}/static/images/icon/close.png">
    <!-- <span class="san"></span> -->
  </section>
  {/if}
  <nav class="gray-nav" style="background:#fff"></nav>
  <div class="search">
    <a>
      <img src="/static/images/icon/search.png"/>
      <input style="width: 135px;" id="sq" type="text" name="sq" placeholder="输入战队名称查看排名">
      <span class="sbt fr plr5">搜索</span>
    </a>
  </div>
  <div class="round-tab">
    <a id="all-member" class="rank_tab">积分榜</a>
    <a id="all-zlc" class="rank_tab">总里程榜</a>
    <a id="all-pace" class="rank_tab">配速榜</a>
    <a id="all-moods" class="rank_tab">人气榜</a>
  </div>
  <div id="wrapper" style="top:145px;">
    <div id="list" class="#scroller">
      <section class="all-member pb50" style="display: none;">
        <p class="p10 ac color_gray f12">每日24点更新积分榜，竞赛第<span id="day-num">3</span>日</p>
        <section id="empty" class="empty-box no">
          <div>
            <img src="http://irun.hupu.com/static/images/bg/image1_03-min.png" >
            <p class="plr20">
            快快去备战训练为竞赛做准备吧！
            竞赛开始时再来一探究竟谁是高手吧！
            </p>
          </div>
        </section>
      
        <ul class="paome-rank top integral"> </ul>
        <ul class="paome-rank list integral"></ul>
        <div class="stop dn">－－－止步于预选赛的战队－－－</div>
        <ul class="paome-rank over pb50 dn"></ul>
      </section>
      <!-- 全员跑量榜  更改为  积分榜 -->
      <section class="all-zlc pb50">
        <p class="p10 ac color_gray f12">榜单每日24点清零</p>
        <section id="empty" class="empty-box no">
          <div>
            <img src="http://irun.hupu.com/static/images/bg/image1_03-min.png" >
            <p class="plr20">
            快快去备战训练为竞赛做准备吧！
            竞赛开始时再来一探究竟谁是高手吧！
            </p>
          </div>
        </section>
    
        <ul class="paome-rank top"></ul>
        <ul class="paome-rank list"></ul>
        <div class="stop dn">－－－止步于预选赛的战队－－－</div>
        <ul class="paome-rank over pb50 dn"></ul>
      </section>
      <!-- 总里程榜 -->

      <section class="all-pace pb50" style="display: none;">
        <p class="p10 ac color_gray f12">榜单每日24点清零</p>
        <section id="empty" class="empty-box no">
          <div>
            <img src="http://irun.hupu.com/static/images/bg/image1_03-min.png" >
            <p class="plr20">
            快快去备战训练为竞赛做准备吧！
            竞赛开始时再来一探究竟谁是高手吧！
            </p>
          </div>
        </section>
       
        <ul class="paome-rank top"></ul>
        <ul class="paome-rank list"></ul>
        <div class="stop dn">－－－止步于预选赛的战队－－－</div>
        <ul class="paome-rank over pb50 dn"></ul>
      </section>
      <!-- 配速榜 -->

      <section class="all-moods pb50" style="display: none;">
        <section id="empty" class="empty-box no">
          <div>
            <img src="http://irun.hupu.com/static/images/bg/image1_03-min.png" >
            <p class="plr20">
            快快去备战训练为竞赛做准备吧！
            竞赛开始时再来一探究竟谁是高手吧！
            </p>
          </div>
        </section>
        
        <ul class="paome-rank top"></ul>
        <ul class="paome-rank list"></ul>
        <div class="stop dn">－－－止步于预选赛的战队－－－</div>
        <ul class="paome-rank over pb50 dn"></ul>
      </section>
      <!-- 人气榜 -->
  </div>

  <nav class="homenav">
    <a href="paomeHome"><i class="iconfont icon-zhuye"></i>首 页</a>
    <a class="on" href="paomeRank"><i class="iconfont icon-paihangbang"></i> 排行榜</a>
    <a href="paoLobby"><i class="iconfont icon-dating"></i>大 厅</a>
     <a href="meCenter">
       <i class="iconfont icon-wode">
           {if $msgNoReadNum>0}
            <sub id="nav-news">●</sub>
           {/if}
        </i>
        我的
    </a>
  </nav>
  <!-- 主导航 -->
</body>

<script id="gray-nav_tpl" type="text/html">
  <% for(var i in roundList) { %>
  <a<% if(roundList[i].isCurrent * 1 == 1) { %> class="on"<% } %> data-rid="<%=roundList[i].roundId%>"><%=roundList[i].title%></a>
  <% } %>
</script>

<script id="all-zlc_tpl" type="text/html">
   <li class="duo">
    <span>排名</span>
    <p>俱乐部</p>
    <span>积分（可获得）</span>
    <span class="text-box ml10"></span>
  </li>
  <% for(var i = 0; i < list.length; i++) { %>
  <li<% if(isMe != undefined && isMe == 1) { %> class="me"<% } %>>
    <div>
      <span<% if(list[i].rankValue   * 1 < 0) { %> class="down"<% } else if(list[i].rankValue   * 1 > 0) { %> class="up"<% } %>>
        <b><% if(!list[i].rank) { %>--<% } else { %><%=list[i].rank%><% } %></b>
        <% if(list[i].rankChangeInfo) { %>
          <%=list[i].rankChangeInfo.desc%>
        <% } %>
      </span>
      <a href="clubDetailNo?clubId=<%=list[i].clubId %>">
       <img src="<%=list[i].image%>?imageView2/2/w/128"/>
      </a>
      <p><%=list[i].clubName%></p>
      <span class="jf"><%if(list[i].score==0){%>--<%}else{%><%=list[i].score%><%}%></span>
      <span style="width:48px;" class="color_dakgray ml10"><%=list[i].rankValue%></span>
    </div>
    <ol>
      <% for(var r = 0; r < list[i].childList .length; r++) { %>
      <li>
        <span><%=list[i].childList [r].date%></span>
        <span>积分
        <%if(list[i].childList [r].score==0){%>--<%}else{%> <%=list[i].childList [r].score%><%}%>
        </span>
        <span>
        排名
        <%if(list[i].childList [r].rankNum==null){%>
        --
        <%}else{%>
        <%=list[i].childList [r].rankNum%>
        <%}%>
        </span>
        <span>
          <i class="small-text"></i>
          <%=list[i].childList [r].rankValue%>
        </span>
      </li>
       <% } %>
    </ol>
  </li>
  <% } %>
</script>
<!-- 配速 里程 人气 榜 -->
<script id="all-member_tpl" type="text/html">
  <li class="duo">
    <span>排名</span>
    <p>俱乐部</p>
    <span>跑量</span>
    <span>配速</span>
    <span>人气</span>
    <span>累计积分</span>
  </li>
  <% for(var i = 0; i < list.length; i++) { %>

  <li<% if(isMe != undefined && isMe == 1) { %> class="me"<% } %>>
    <span<% if(list[i].rankValue  * 1 < 0) { %> class="down"<% } else if(list[i].rankValue  * 1 > 0) { %> class="up"<% } %>>
      <b><% if(!list[i].rank) { %>--<% } else { %><%=list[i].rank%><% } %></b>
      <% if(list[i].rankChangeInfo) { %>
        <%=list[i].rankChangeInfo.desc%>
      <% } %>
    </span>
    <a href="clubDetailNo?clubId=<%=list[i].clubId%>">
      <img src="<%=list[i].image%>?imageView2/2/w/128"/>
    </a>
    <p><%=list[i].clubName%></p>
    <span><%if(list[i].mileageScore==0){%>--<%}else{%><%=list[i].mileageScore%><%}%></span>
    <span><%if(list[i].speedScore==0){%>--<%}else{%><%=list[i].speedScore%><%}%></span>
    <span><%if(list[i].supportScore==0){%>--<%}else{%><%=list[i].supportScore%><%}%></span>
    <span class="color_dakgray"><%if(list[i].rankValue==0){%>--<%}else{%><%=list[i].rankValue%><%}%></span>
  </li>
  <% } %>
</script>
<!-- 积分排行模板 -->
<script type="text/javascript">
var myScroll;
function loaded () {
  myScroll = new IScroll('#wrapper', { bounceEasing: 'elastic', bounceTime: 100 });
}

var currentRoundId = '',
    currentMaxRoundId = '',
    rankType = '',
    sq = '';

$(function(){
  // RoundInfo
  getPaomeApi('get', '/paome_webIndex/getPaomeRoundListApi', {}, renderRoundInfo);

  $('.sbt').click(function(){
    sq = $.trim($('#sq').val());
    $('#list .paome-rank li').remove();
    showRank();
  });

});

function renderRoundInfo(data){
  data = {'roundList': {'100': {'roundId': 100, 'title': '冠军争霸赛', 'isCurrent': 1}}};
  for(var k in data.roundList) {
    if(data.roundList[k].isCurrent * 1 == 1) {
      currentMaxRoundId = k * 1;
      currentRoundId = !currentRoundId ? currentMaxRoundId : currentRoundId;
    }
  }
  var html = template('gray-nav_tpl', data);
  $('.gray-nav').html(html);

  $('.gray-nav a').click(function(){
    var rid = $(this).attr('data-rid');
    if(rid > currentMaxRoundId) {
      return;
    }
    $('.gray-nav a').each(function(){
      if($(this).attr('data-rid') == rid) {
        $(this).addClass('on');
        currentRoundId = rid;
        $('#all-zlc').click();
      } else {
        $(this).removeClass('on');
      }
    });
  });

  $('.rank_tab').click(function(){
    var tab_class = $(this).attr('id');
    $('.rank_tab').each(function(){
      if($(this).attr('id') == tab_class) {
        $(this).addClass('on');
      } else {
        $(this).removeClass('on');
      }
    });
    $('#wrapper section').each(function(){
      if($(this).hasClass(tab_class)) {
        $(this).show();
        showRank(tab_class);
      } else {
        $(this).hide();
      }
    });
  });

  $('#all-member').click();
}

function showRank(tab) {
  var rankTypes = {
    'all-zlc': 1,
    'all-pace': 5,
    'all-moods': 10,
    'all-member': 20
  };

  if(!tab && rankType) {
    tab = rankType;
  }

  if(rankTypes[tab] == undefined) {
    return;
  } else {
    rankType = tab;
  }
      

  var param = {'roundId': currentRoundId, 'typeWd': rankTypes[tab], 'clubName': sq};
  getPaomeApi('get', '/paome_webIndex/getRankForH5', param, renderRank);
}

function renderRank(data) {
  if(data.list != undefined) {

    var rank = {'list': []};
    var tpl = rankType == 'all-member' ? 'all-member_tpl' : 'all-zlc_tpl';
    var html = '';

    $('.' + rankType + ' ul').hide();
    $('.' + rankType + ' .stop').hide();
    $('.' + rankType + ' .empty-box').hide();
    
    if(rankType == 'all-zlc') {
      for(var i in data.list) {
        if(i == 'topRankInfo' && data.list.topRankInfo) {
           var valueM =new Number(data.list.topRankInfo.rankValue);
           if(valueM==0){
            data.list.topRankInfo.rankValue = '--'
           }else{
           data.list.topRankInfo.rankValue = valueM.toFixed(2)+'km';
           }
           for(var q in data.list[i].childList){
                var valueM = new Number(data.list[i].childList[q].rankValue)
               if(valueM==0){
                data.list[i].childList[q].rankValue = '--'
               }else{
                data.list[i].childList[q].rankValue = valueM.toFixed(2)+'km';
               }
             }
        } else if(i == 'list' || i == 'overRankList') {
          for(var j in data.list[i]) {
             var valueM = new Number(data.list[i][j].rankValue)
             if(valueM==0){
              data.list[i][j].rankValue = '--'
             }else{
             data.list[i][j].rankValue = valueM.toFixed(2)+'km';
             }
             for(var q in data.list[i][j].childList){
               var valueM = new Number(data.list[i][j].childList[q].rankValue)
               if(valueM==0){
                data.list[i][j].childList[q].rankValue = '--'
               }else{
                data.list[i][j].childList[q].rankValue = valueM.toFixed(2)+'km';
               }
              
             }
          }
        }
      }
    } else if(rankType == 'all-pace'||rankType == 'all-moods'){
      for(var i in data.list) {
        if(i == 'topRankInfo' && data.list.topRankInfo) {
           var valueM =data.list.topRankInfo.rankValue;
           if(valueM=="00'00''"||valueM==0){
              data.list.topRankInfo.rankValue = '--'
             }
            for(var q in data.list[i].childList){
                var valueM =data.list[i].childList[q].rankValue;
               if(valueM=="00'00''"||valueM==0){
                  data.list[i].childList[q].rankValue = '--'
                 }
             }
        } else if(i == 'list' || i == 'overRankList') {
          for(var j in data.list[i]) {
            var valueM =data.list[i][j].rankValue
             if(valueM=="00'00''"||valueM==0){
              data.list[i][j].rankValue = '--'
             }
             for(var q in data.list[i][j].childList){
               var valueM =data.list[i][j].childList[q].rankValue
               if(valueM=="00'00''"||valueM==0){
                data.list[i][j].childList[q].rankValue = '--'
               }
             }
          }
        }
      }
    }
    if(rankType == 'all-member'){
       for(var i in data.list) {
        if(i == 'topRankInfo' && data.list.topRankInfo) {
          var valueM =new Number(data.list.topRankInfo.rank);
          if(valueM==0){
            data.list.topRankInfo.rank ="--"
         }
        } else if(i == 'list' || i == 'overRankList') {
         
          for(var j in data.list[i]) {
            var valueM = new Number(data.list[i][j].rank)
            if(valueM==0){
              data.list[i][j].rank = "--"
            }
          }
        }
      }
    }
    
    if(data.list.topRankInfo != undefined && JSON.stringify(data.list.topRankInfo).length > 2) {
      rank.list[0] = data.list.topRankInfo;
      rank.isMe = 1;
      html = template(tpl, rank);
      $('.' + rankType + ' .top').html(html).show();
      rank.isMe = 0;
  
    }

    if(data.list.list != undefined && data.list.list.length > 0) {
      rank.list = data.list.list;
      html = template(tpl, rank);
      $('.' + rankType + ' .list').html(html).show();

    }

    if(data.list.overRankList != undefined && data.list.overRankList.length > 0) {
      rank.list = data.list.overRankList;
      html = template(tpl, rank);
      $('.' + rankType + ' .stop').show();
      $('.' + rankType + ' .over').html(html).show();
    }
   
    if(rank.list.length == 0) {

      $('.' + rankType + ' .empty-box').show();
    }else{
      $(".mileage-title").show();
    }

    
    if(data.list.topRankInfo.clubId){
     $(".list .duo").hide()
    }else{
      $(".list .duo").show()
    }
    if(rankType == 'all-zlc' ){
      $(".text-box").html("今日跑量").show()
      $(".small-text").html("跑量")
    }
    if(rankType == 'all-pace'){
      $(".text-box").html("今日配速").show()
      $(".small-text").html("配速")
    }
    if(rankType == 'all-moods'){
      $(".text-box").html("累计人气").show()
      $(".small-text").html("人气")
    }


  }
}
var o = document.getElementById("tipss");
if(o){
  var boxHeight = o.offsetHeight  
  var e = Number(boxHeight)+145
  console.log(e)

  if(boxHeight!=0){
    $("#wrapper").css("top", e)
  }
  $("#share-close").click(function(){
    $(".share-tips").hide()
    $("#wrapper").css('top','145px')
    $.get('{$appHost}/paome_webIndex/closeTop');
  })
}
$(".search").click(function(){
   $(".search a").addClass('on')
})
 $(".search input").blur(function(){
   $(".search a").removeClass('on');
   $(".search a").click();
}) 
 // $(".all-moods #text-box").html("人气")
 // $(".all-pace #text-box").html("配速")
 // $(".all-zlc #text-box").html("人气")
 var oneday = 147;

    var now = parseInt((new Date()).getTime()/1000)
      console.log(now)

    if(now<1481299199){
      console.log(2)
      $("#day-num").html("1")
    }else if(1481299201<now&&now<1481385599){
      $("#day-num").html("2")
    }else{
      $("#day-num").html("3")
    }
</script>

</html>
